<template>
  <!-- 质量检查情况 -->
  <a-spin :spinning="loading">
    <a-card>
      <title-name :title="`${$route.query.month}月品质专项治理检查排名`"></title-name>
      <!-- 详情列表 -->
      <div style="padding: 0 20px 20px;">
        <title-name title="专项治理统计"></title-name>
        <div v-for="(item, index) in countProjectMap" :key="index" class="mb20">
          <div class="branchName">{{ index }}</div>
          <a-table bordered rowKey="id" :pagination="false" :columns="columns" :dataSource="item"> </a-table>
          <Empty v-if="!Object.keys(item) || !Object.keys(item).length" description="暂无数据" />
        </div>
      </div>
    </a-card>
  </a-spin>
</template>

<script>
import { getSpecialScore } from '@/api/quality/qualityMonth' // api
import assetApi from '@/api/office/asset' // api
import { Empty } from 'ant-design-vue' // 无数据提示
import { columns999 } from './qualityManagementInfoColumns'
export default {
  name: 'a' + Date.now(),
  props: {
    // 请求参数
    queryParam: {
      type: Object,
      default: () => null
    }
  },
  components: {
    Empty
  },
  data() {
    return {
      loading: false, // 加载控件
      countProjectMap: {} // 统计表格列表
    }
  },
  computed: {
    // 统计表头
    columns() {
      const columns = this.$clone(columns999)
      return columns
    }
  },
  mounted() {
    // 初始化列表
    this.getColumns()
  },
  methods: {
    /**
     * 初始化表头
     */
    getColumns() {
      this.loading = true
      this.columns.length === 3 &&
        assetApi.typesLabel({ type: 47 }).then((res) => {
          if (res.code === 200) {
            this.columns.splice(
              2,
              0,
              ...res.data.map((i) => ({
                dataIndex: i.code,
                title: i.name,
                align: 'center',
                customRender: (e) => e ?? '-'
              }))
            )
          }
          this.init()
        })
    },
    /**
     * 初始化
     */
    init() {
      this.loading = true
      getSpecialScore({isJurisdiction: false, ...this.queryParam})
      .then((res) => {
        if (res.data) {
          // 映射统计表格信息
          this.countProjectMap = res.data.countProjectMap || {}
        }
      })
      .finally(() => {
        this.loading = false
      })
    },
  }
}
</script>
